<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>河南青少年机器人竞赛</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
    		<link href="css/mui.min.css" rel="stylesheet"/>
    		<link href="css/style.css" rel="stylesheet"/>
		<style>
			.mui-input-row{border-bottom: 1px solid #ccc;}
			.mui-input-row label{font-size: 16px;}
			p{margin-bottom: 0;}
		</style>
	</head>
	<body>
		<header class="mui-bar mui-bar-nav">
			<a id="back" class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">队伍管理</h1>
			<a onclick="addTeam()" class="mui-icon-right-nav mui-pull-right"><span class="mui-icon mui-icon-plus"></span></a>
		</header>
		<div class="mui-content">
			<div style="padding: 10px 10px;">
				<div id="segmentedControl" class="mui-segmented-control">
					<a class="mui-control-item" data-value="1" style="touch-action: none;">
						市赛
					</a>
						<a class="mui-control-item mui-active selected" data-value="2" style="touch-action: none;">
						省赛
					</a>
				</div>
			</div>
			<div class="city-teamList" style="display: none;">
			</div>
			<div class="province-teamList">
				<!--<div class="mui-card">-->
					<!--<div class="mui-card-header">页眉 <button type="button" class="mui-btn mui-btn-link">修改</button></div>-->
					<!--<div class="mui-input-row mui-checkbox">-->
						<!--<label>机器人挑战(A类) -初中组</label>-->
						<!--<input name="checkbox1" value="Item 1" type="checkbox">-->
					<!--</div>-->

					<!--<div class="mui-card-content">-->
						<!--<div class="mui-card-content-inner robot-team-list">-->
							<!--<h4 style="text-align: center;">郑州中学一队</h4>-->
							<!--<div class="title">-->
								<!--组员-->
							<!--</div>-->
							<!--<ul class="mui-table-view">-->
								<!--<li class="mui-table-view-cell">-->
									<!--<span class="mui-pull-left"></span>张三(男) 	<span class="mui-pull-right">衣服尺码:XLL</span>-->
									<!--<div>410321198602021234</div>-->
								<!--</li>-->
								<!--<li class="mui-table-view-cell">-->
									<!--<span class="mui-pull-left"></span>李四(男) 	<span class="mui-pull-right">衣服尺码:XLL</span>-->
									<!--<div>410321198602021234</div>-->
								<!--</li>-->
								<!--<li class="mui-table-view-cell">-->
									<!--<span class="mui-pull-left"></span>张三(男) 	<span class="mui-pull-right">衣服尺码:XLL</span>-->
									<!--<div>410321198602021234</div>-->
								<!--</li>-->
								<!--<li class="mui-table-view-cell">-->
									<!--<span class="mui-pull-left"></span>李四(男) 	<span class="mui-pull-right">衣服尺码:XLL</span>-->
									<!--<div>410321198602021234</div>-->
								<!--</li>-->
							<!--</ul>-->
							<!--<div class="title">-->
								<!--辅导老师-->
							<!--</div>-->
							<!--<ul class="mui-table-view">-->
								<!--<li class="mui-table-view-cell">-->
									<!--<span class="mui-pull-left"></span>王五 	<span class="mui-pull-right">15621344321</span>-->
								<!--</li>-->
								<!--<li class="mui-table-view-cell">-->
									<!--<span class="mui-pull-left"></span>王五 	<span class="mui-pull-right">15621344321</span>-->
								<!--</li>-->
							<!--</ul>-->
						<!--</div>-->
					<!--</div>-->
				<!--</div>-->

			</div>


			<!--<div class="btn-area mui-button-row" style="margin-bottom: 30px;">-->
				<!--<button type="button" onclick="addTeam()" class="mui-btn mui-btn-primary">继续添加报名队伍</button>-->
				<!--&lt;!&ndash;<button id="pay-btn" type="button" class="mui-btn mui-btn-success">去支付</button>&ndash;&gt;-->
			<!--</div>-->

		</div>
		<script src="js/mui.min.js"></script>
		<script src="js/jquery-1.9.1.min.js"></script>
		<script type="text/javascript">


			mui.ready(function(){
				getList()
			});
			var flag=$(".mui-active").attr("data-value");
			function getList(){
				$('.teamList').empty();
				flag=$("a.selected").attr("data-value");
				//$('.teamList').empty();
				//获取当前页面是市赛还是省赛
				$.ajax({
					data:"",
					dataType:'json',//服务器返回json格式数据
					type:'get',//HTTP请求类型
					url:'../team/front/',
					contentType: 'application/json',
					//timeout:10000,//超时时间设置为10秒；
					success:function(data){
						console.log(data);
						var result = data.data;
						var htmlCity="";
						var htmlProvince="";
						if(result!=null){
							$.each(result,function(i,e){
								var rel="";
								//过滤是否为省赛
									rel+='<div class="mui-card"> <input type="hidden" name="id" value="'+e.id+'"> ' +
											'<div class="mui-card-header"><div class="mui-media-body">' +e.company.name ;
									if(e.projectClassEnum=="XIAOXUE"){
										rel+='<p>小学组</p>';
									}else if(e.groupType=="CHUZHONG"){
										rel+='<p>初中组</p>';
									}else if(e.groupType=="GAOZHONG"){
										rel+='<p>高中组</p>';
									}
									rel+='</div><button type="button" class="mui-btn mui-btn-link edit-team" data-id="'+e.id+'" data-end-time="'+e.project.baoMingEndTime+'">修改</button>' +
											'</div>';
									rel+='<div class="mui-card-content">' +
											'<div class="mui-card-content-inner robot-team-list">' +
											'<h4 style="text-align: center;">'+e.teamName+'</h4>' ;

									if(e.teamMembers.length>0){
										rel+='<div class="title">组员</div><ul class="mui-table-view">' ;
										$.each(e.teamMembers,function(index,item){
											rel+=' <li class="mui-table-view-cell">' +
													' <span class="mui-pull-left"></span>'+item.name+'('+(item.sex==0?"男":"女")+') <span class="mui-pull-right">衣服尺码:'+item.size;
											if(item.size=="S"){
												rel+='(140-155)';
											}else if(item.size=="M"){
												rel+='(155-170)';
											}else if(item.size=="L"){
												rel+='()';
											}else if(item.size=="XL"){
												rel+='(170-185)';
											}else if(item.size=="XXL"){
												rel+='()';
											}else if(item.size=="XXXL"){
												rel+='(185以上)';
											}
											rel+='</span>' +
													' <div>'+item.idCard+'</div>' +
													' </li>' ;
										});
										rel+='</ul>';
									}
									if(e.teamLeaders.length>0){
										rel+='<div class="title">辅导老师</div><ul class="mui-table-view">' ;
										$.each(e.teamLeaders,function(index,item){
											rel+=' <li class="mui-table-view-cell">' +
													' <span class="mui-pull-left"></span>'+item.name+' <span class="mui-pull-right">'+item.phone+'</span>' +
													' </li>' ;
										});
										rel+='</ul>';
									}
									rel+='</div></div>';
									rel+='<div class="mui-card-footer">'+(e.jiaoFei!=null?"已缴费":"未缴费")+'</div>'
									rel+='</div>';
								// if(e.templateId!=null&&flag==2){
								// 	$('.teamList').append(rel);
								// }else if(e.templateId==null&&flag==1){
								// 	$('.teamList').append(rel);
								// }else{
								// 	mui.toast("暂无数据",{ duration:'2000', type:'div' });
								// }
								if(e.templateId!=null){
									htmlProvince+=rel;
								}else{
									htmlCity+=rel;
								}
							});
							$('.city-teamList').append(htmlCity);
							$('.province-teamList').append(htmlProvince);
						}else{
							mui.toast("暂无数据",{ duration:'2000', type:'div' });
						}

					},
					error:function(xhr,type,errorThrown){
						//异常处理；
						console.log(xhr);
						console.log(type);
						console.log(errorThrown);
					}
				});
			}
			mui("#segmentedControl").on('tap','a',function(){
				var match = $(this).attr("data-value");
				$(this).addClass("selected");
				$(this).siblings().removeClass("selected");
				if(match==1){
					$(".city-teamList").show();
					$(".province-teamList").hide();
					if($(".city-teamList .mui-card").length==0){
						mui.toast("暂无数据",{ duration:'2000', type:'div' });
					}
				}else{
					$(".city-teamList").hide();
					$(".province-teamList").show();
					if($(".province-teamList .mui-card").length==0){
						mui.toast("暂无数据",{ duration:'2000', type:'div' });
					}
				}
				//getList();
			});
			function addTeam(){
				//window.location.href='applyTeam.html';
				mui.openWindow({
					url:'applyTeam.html'
				});
			}
			mui(".btn-area").on('tap','#pay-btn',function(){
				var list = new Array();
				mui(".mui-checkbox input").each(function(index,item){
					if(this.checked){
						list.push(this.value)
					}
				})
				if(list.length>0){
					//做跳转处理
				}else{
					mui.toast("请先勾选队伍",{ duration:'2000', type:'div' });
				}
			});


			//队伍编辑
			mui(".mui-content").on('tap','.edit-team',function(){
				localStorage.setItem("teamId",$(this).attr("data-id"));
				var endTime=new Date($(this).attr("data-end-time"));
				var nowTime=new Date();
				if(nowTime<endTime){
					mui.openWindow({//目标页面
						url: 'editTeam.html'
					});
				}else{
					mui.toast("报名时间已截止",{ duration:'2000', type:'div' });
				}
			});
			mui(".mui-content").on('tap','.mui-card-content',function(){
				var that = this;
				var btnArray = ['否', '是'];
				mui.confirm('是否确认删除？', '温馨提示', btnArray, function(e) {
					if (e.index == 1) {
						if($(that).parent().find("input[name=id]")){
							$.ajax({
								type: "post",
								url: "../team/front/deleteTeam",
								data: {"id":$(that).parent().find("input[name=id]").val()},
								dataType: "json",
								success: function(data){
									if(data.success){
										sleep(500);
										$(that).parent().remove();
									}else{
										mui.toast(data.message,{ duration:'2000', type:'div' });
									}
								},
								error:function(){
									mui.toast('删除队伍信息出现异常，请联系管理员',{ duration:'2000', type:'div' });
								}
							});
						}
					}
				})
				mui.toast("长按删除",{ duration:'2000', type:'div' });
			});
			mui(".mui-content").on('longtap','.mui-card-content',function(){
				mui.toast("删除",{ duration:'2000', type:'div' });
			});
			$("#back").click(function(){
				mui.openWindow({
					url:'index.html'
				});
			})

			// var list = new Array();
			// mui('.mui-checkbox').on('change', 'input', function() {
			// 	var value = this.checked?"true":"false";
			// 	if(value){
			// 		list.push(this.value)
			// 	}
			// 	console.log(list)
			// 	this.previousElementSibling.innerText = "checked："+value;
			// });
		</script>
	</body>
</html>
